<template>
  <!-- 折线图 -->
  <div>
    <div id="chart_Line"
         ref="chart_Line"
         style="width:100%;height:100%"></div>
  </div>
</template>

<script>
export default {
  name: 'Chart_Line',
  props: {
    option: {
      type: Object,
      required: true
      // default: () => ()
    }
  },
  mounted () {
    // console.log(this.$echarts, 'echarts');
    this.makechart()
  },
  methods: {
    makechart () {
      // let chart_Line = this.$echarts.init(document.getElementById('chart_Line'))
      const chart_Line = this.$echarts.init(this.$refs.chart_Line)
      chart_Line.setOption(this.option)
      //图表跟随屏幕自适应
      window.addEventListener('resize', () => chart_Line.resize()
      )
    }
  }
}
</script>